<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    <%@ include file="../../share/layoutForm.jsp"%> 
  </head>
  
  <body>
	<div class="widget-body">
		<div id="wizard" class="wizard" data-target="#wizard-steps" style="border-left: none; border-top: none; border-right: none;">
			<ul class="steps">
				<li data-target="#step-1" class="active"><span class="step">1</span>系统功能<span class="chevron"></span></li>
				<li data-target="#step-2"><span class="step">2</span>系统按钮<span class="chevron"></span></li>
				<li data-target="#step-3"><span class="step">3</span>系统视图<span class="chevron"></span></li>
				<li data-target="#step-4"><span class="step">4</span>数据权限<span class="chevron"></span></li>
			</ul>
		</div>
		<div class="step-content" id="wizard-steps" style="border-left: none; border-bottom: none; border-right: none;">
			<div class="step-pane active" id="step-1">
				<div id="ModuleTree" style="margin: 10px;"></div>
			</div>
			<div class="step-pane" id="step-2">
				<div id="ModuleButtonTree" style="margin: 10px;"></div>
			</div>
			<div class="step-pane" id="step-3">
				<div id="ModuleColumnTree" style="margin: 10px;"></div>
			</div>
			<div class="step-pane" id="step-4" style="margin: 15px; margin-bottom: 0px;">
				<div>
					<ul class="list-group">
						<li class="list-group-item">
							<div class="radio">
								<label>
									<input name="authorizeType" type="radio" checked="checked" value="-1" />&nbsp;
										仅限本人
								</label>
							</div>
						</li>
						<li class="list-group-item">
							<div class="radio">
								<label>
									<input name="authorizeType" type="radio" value="-2" />&nbsp;
										仅限本人及下属
								</label>
							</div>
						</li>
						<li class="list-group-item">
							<div class="radio">
								<label>
									<input name="authorizeType" type="radio" value="-3" />&nbsp;
										所在部门
								</label>
							</div>
						</li>
						<li class="list-group-item">
							<div class="radio">
								<label>
									<input name="authorizeType" type="radio" value="-4" />&nbsp;
										所在公司
								</label>
							</div>
						</li>
						<li class="list-group-item">
							<div class="radio">
								<label>
									<input name="authorizeType" type="radio" value="-5" />&nbsp;
										自定义设置
								</label>
							</div>
							<div id="OrganizeTree" style="margin: 10px; margin-bottom: 0px;"></div>
							<div id="OrganizeTreebackground" style="position: fixed; top: 251px; left: 15px; z-index: 2; width: 670px; height: 343px; background: #000; filter: alpha(opacity=10); opacity: 0.1;"></div>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
	<div class="form-button" id="wizard-actions">
		<a id="btn_last" disabled class="btn btn-default btn-prev">上一步</a>
		<a id="btn_next" class="btn btn-default btn-next">下一步</a>
		<a id="btn_finish" disabled class="btn btn-success">完成</a>
	</div>
	
	<script type="text/javascript">
		var postId = request('postId');
		$(function () {
			initialPage();
			GetModuleTree();
			GetModuleButtonTree();
			//GetModuleColumnTree();
			GetOrganizeTree();
		})
		//初始化页面
		function initialPage() {
			//加载导向
			$('#wizard').wizard().on('change', function (e, data) {
				var $finish = $("#btn_finish");
				var $next = $("#btn_next");
				if (data.direction == "next") {
					if (data.step == 1) {
						var ModuleId = $("#ModuleTree").getCheckedAllNodes();
						for (var i = 0; i < ModuleId.length; i++) {
							var $thisid = $("#ModuleButtonTree").find('ul').find('[data-value=' + ModuleId[i] + ']').parent().parent();
							$thisid.show();
							$thisid.parents('ul').find('.' + ModuleId[i]).parent().show();
						}
					}
					if (data.step == 2) {
						var ModuleId = $("#ModuleTree").getCheckedAllNodes();
						for (var i = 0; i < ModuleId.length; i++) {
							var $thisid = $("#ModuleColumnTree").find('ul').find('[data-value=' + ModuleId[i] + ']').parent().parent();
							$thisid.show();
							$thisid.parents('ul').find('.' + ModuleId[i]).parent().show();
						}
					}
					if (data.step == 3) {
						$finish.removeAttr('disabled');
						$next.attr('disabled', 'disabled');
					}
				} else {
					$finish.attr('disabled', 'disabled');
					$next.removeAttr('disabled');
				}
			});
			//数据权限 、点击类型触发事件
			$("input[name='authorizeType']").click(function () {
				var value = $(this).val();
				if (value == -5) {
					$("#OrganizeTreebackground").hide();
					//$("#OrganizeTree").find('a,span,i').css({ color: '#000' });
				} else {
					$("#OrganizeTreebackground").show();
					//$("#OrganizeTree").find('a,span,i').css({ color: '#d0d0d0' });
				}
			})
			buttonOperation();
		}
		//获取系统功能
		function GetModuleTree() {
			var item = {
				height: 540,
				showcheck: true,
				url: "<%=basePath%>sysPermissionRole/treeModuleTree.do?roleId=" + postId
			};
			$("#ModuleTree").treeview(item);
		}
		//获取系统按钮
		function GetModuleButtonTree() {
			var item = {
				height: 540,
				showcheck: true,
				url: "<%=basePath%>sysPermissionRole/treeModuleButtonList.do?roleId=" + postId
			};
			$("#ModuleButtonTree").treeview(item);
			$("#ModuleButtonTree").find('.bbit-tree-node-el').hide();
		}
		//获取系统视图
		function GetModuleColumnTree() {
			var item = {
				height: 540,
				showcheck: true,
				url: "<%=basePath%>sysPermissionRole/treeModuleColumnList.do?roleId=" + postId
			};
			$("#ModuleColumnTree").treeview(item);
			$("#ModuleColumnTree").find('.bbit-tree-node-el').hide();
		}
		//获取组织架构
		function GetOrganizeTree() {
			$.ajax({
				url: "<%=basePath%>sysPermissionRole/treeOrganizeList.do?roleId=" + postId,
				type: "GET",
				dataType: "json",
				async: false,
				success: function (data) {
					var $treeJson = data.treeJson;
					var $authorizeType = data.authorizeType;
					var $authorizeData = data.authorizeData;
					var item = {
						height: 330,
						showcheck: true,
						data: JSON.parse($treeJson),
					};
					$("#OrganizeTree").treeview(item);
					$("input[name='authorizeType'][value=" + $authorizeType + "]").trigger("click");
					$("#OrganizeTree").find('li.bbit-tree-node').each(function () {
						var $li = $(this);
						$li.css({ position: 'relative' });
						var _data_value = $li.find('a').find('span').attr('data-value');
						var _html = '<div style="position: absolute;right: 0px;top:4px;z-index: 1;"><div class="checkbox">';
						_html += '<label><input name="' + _data_value + '" type="checkbox" value="1" />只读</label>';
						_html += '</div></div>';
						$li.append(_html);
					});
					$.each($authorizeData, function (i) {
						var row = $authorizeData[i]
						var resourceId = row.ResourceId;
						var IsRead = row.IsRead;
						if (IsRead == 1) {
							$("input[name='" + resourceId + "']").attr("checked", true);
						}
					});
				}
			});
		}
		//按钮操作（上一步、下一步、完成、关闭）
		function buttonOperation() {
			var $last = $("#btn_last");
			var $next = $("#btn_next");
			var $finish = $("#btn_finish");
			//完成提交保存
			$finish.click(function () {
				var postData = $("#form1").GetWebControls();
				postData["postId"] = postId;
				postData["moduleIds"] = String($("#ModuleTree").getCheckedAllNodes());
				postData["moduleButtonIds"] = String($("#ModuleButtonTree").getCheckedAllNodes());
				postData["moduleColumnIds"] = String($("#ModuleColumnTree").getCheckedAllNodes());
				postData["authorizeDataJson"] = JSON.stringify(GetDataAuthorize());
				$.SaveForm({
					url: "<%=basePath%>sysPermissionPost/saveAuthorize.do",
					param: postData,
					loading: "正在保存岗位授权...",
					success: function () {
						$.currentIframe().$("#gridTable").trigger("reloadGrid");
					}
				})
			})
		}
		//获取数据范围权限选中值、返回Json
		function GetDataAuthorize() {
			var dataAuthorize = [];
			var authorizeType = $("input[name='authorizeType']:checked").val();
			if (authorizeType == -5) {
				var selectedData = $("#OrganizeTree").getCheckedAllNodes();
				for (var i = 0; i < selectedData.length; i++) {
					var ResourceId = selectedData[i];
					var IsRead = $("input[name='" + ResourceId + "']:checked").val() == 1 ? 1 : 0;
					var rowdata = {
						ResourceId: ResourceId,
						IsRead: IsRead,
						AuthorizeType: -5
					}
					dataAuthorize.push(rowdata);
				}
			} else {
				var rowdata = {
					IsRead: 0,
					AuthorizeType: authorizeType
				}
				dataAuthorize.push(rowdata);
			}
			return dataAuthorize;
		}
	</script>
</body>
</html>
